<?php 
require_once dirname(__FILE__) . '/../includes/common.inc.php';
require_once dirname(__FILE__) . '/../includes/pdoorm.inc.php';
   //$_REQUEST['customrid'] = 892;
   //$_REQUEST['orderid'] = 1045;
   
    /*if(!isset($_SESSION['pwd']) || empty($_SESSION['pwd']))
    {
        header("Location: index.php"); 
        exit;
    }*/
    
$time = time();
   
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>IPAD SIGN HOME</title>
  <link rel="stylesheet" href="signature-pad/build/jquery.signaturepad.css">
<style>
html, body {
font-family: "Helvetica", Geneva, Arial, Verdana, sans-serif;
font-size: 12px;
line-height: 13px;
list-style-type: square;
background:#ffffff;
}

  #container{
   margin-right:auto;
   margin-left:auto;
  }
  .contract_table1 {
    width: 900px;
    height: 30px;
    margin-right:auto;
    margin-left:auto;    
  }
  
  .contract_table2 {
    width: 900px;
    height: 30px;
    margin-right:auto;
    margin-left:auto;    
  }
  .contract_table3 {
    width: 860px;
    height: 158px;
    margin-right:auto;
    margin-left:auto;    
  }
  .contract_table3 tr{height:22px;}
  .contract_table4 {
    width: 860px;
    height: 160px;
  }
  .contract_table5 {
    width: 860px;
    height: 50px;
  }
  .contract_table6 {
    width: 860px;
    height: 35px;
  }
  .contract_table7 {
    width: 860px;
    height: 50px;
  }
  .contract_table8 {
    width: 860px;
    height: 50px;
    /*margin: 8px 0 0 0;*/
    margin-right:auto;
    margin-left:auto;
  }
  .contract_table9 {
    width: 900px;
    height: 30px;
    /*margin: 5px 0 0 0;*/
    margin-right:auto;
    margin-left:auto;    
  }
  .contract_table9 tr{height:22px;}
  .contract_td1 {
    width: 750px;
    height: 25px;
    font-weight:bold;
    font-size:130%;
    color:#663333;
    text-align: right;
    vertical-align: middle;
    padding: 0 10px 0 0;
  }
  .contract_td2 {
    background-image: url('../images/pageasst/contract/background.png');
    background-repeat: no-repeat;
    width: 150px;
    height: 25px;
    text-align: center;
    vertical-align: middle;
    font-size: 20px;
    font-weight: bold;
    color: #000;
    font-family: Arial;
  }
  .contract_td3 {
    width: 120px;
    height: 20px;
    font-weight:bold;
    font-size:110%;
    color:#663333;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td4 {
    width: 310px;
    height: 20px;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td5 {
    width: 120px;
    height: 30px;
    font-weight:bold;
    font-size:100%;
    color:#663333;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td6 {
    width: 310px;
    height: 20px;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td7 {
    width: 860px;
    height: 40px;
    text-align: left;
    vertical-align: middle;
    font-size: 18px;
    font-weight: bold;
    color: #663333;
  }
  .contract_td8 {
    width: 130px;
    height: 30px;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td9 {
    width: 730px;
    height: 30px;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td10 {
    width: 80px;
    height: 30px;
    text-align: left;
    vertical-align: middle;
    font-size: 13px;
    font-weight: bold;
    color: #000;
  }
  .contract_td11 {
    width: 650px;
    height: 30px;
    text-align: left;
    vertical-align: middle;
    font-weight: bold;
    font-size: 12px;
    color: #663333;
  }
  .contract_td12 {
    width: 110px;
    height: 30px;
    text-align: center;
    vertical-align: middle;
  }
  .contract_td13 {
    width: 120px;
    height: 30px;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td14 {
    width: 130px;
    height: 30px;
    text-align: center;
    vertical-align: middle;
  }
  .contract_td15 {
    width: 80px;
    height: 30px;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td16 {
    width: 860px;
    height: 40px;
  }
  .contract_td17 {
    width: 150px;
    height: 60px;
    padding: 0 0 20px 0 ;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td18 {
    width: 710px;
    height: 60px;
    padding: 0 0 20px 0 ;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td19 {
    width: 130px;
    height: 40px;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td20 {
    width: 300px;
    height: 40px;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td21 {
    width: 730px;
    height: 15px;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td22 {
    width: 730px;
    height: 15px;
    text-align: left;
    vertical-align: middle;
    font-size: 12px;
    color: #663333;
  }
  .contract_td23 {
    width: 730px;
    height: 40px;
    text-align: left;
    vertical-align: middle;
    font-size: 14px;
    font-weight: bold;
    color: #000;
  }
  .contract_td24 {
    width: 860px;
    height: 60px;
    text-align: left;
    vertical-align: middle;
  }
  .contract_td25 {
    width: 680px;
    height: 40px;
    text-align: center;
    vertical-align: middle;
    font-size: 14px;
    font-weight: bold;
    color: #000;
    padding: 80px 0 0 0;
  }

  .contract_td255 {
    width: 680px;
    height: 40px;
    text-align: center;
    vertical-align: middle;
    font-size: 14px;
    font-weight: bold;
    color: #000;
    padding: 80px 0 0 80px;

  }
  
  .contract_td26 {
    width: 180px;
    height: 40px;
    text-align: right;
    vertical-align: middle;
    font-size: 14px;
    font-weight: bold;
    color: #000;
    padding: 80px 0 0 0;
  }
  .tltable{
    border:solid 1px #AF9072;
    border-collapse:collapse;  
  }
  .tltd{
    border:1px solid #AF9072;
  }
  .td1{
    padding-left:20px;
    text-align:left;
    vertical-align: middle;
    height:30px;
  }
  .td23{
    text-align:center;
    vertical-align: middle;
    height:30px;
  }
  
  .bd{
    font-weight: bold;
  }
  .bder{
    font-weight: bolder;
  }
  .pl15{padding-left:15px;}
  .f120{font-size:120%;}
  .f130{font-size:130%;}
  .f140{font-size:140%;}
  
</style>
<script type="text/javascript" src="../jquery-1.7.1.min.js"></script>
<script src="signature-pad/build/jquery.signaturepad.min.js"></script>
<script type="text/javascript">
$(function(){
	
	  $.ajax({
			type:'POST',
			url:'server.php',
			data:"orderid=<?php echo $_REQUEST['orderid']; ?>&action=customer",
			dataType: "json",
			success:function(data){
				 showdata(data.data[0]);

				}		
			}); 
	  });

 function  showdata(data)
 {
	  //console.log();
	 /* var piback = parent. document.getElementById('iback');
	  piback.src = 'images/home/nav-back-1.png';

	  piback._customerid = data.customerid;
	   piback.onclick = function(){
		    	window.location.href='query_no.php?customerid='+this._customerid;

			  }*/

	  
	 document.getElementById('customerno').appendChild(document.createTextNode('<?php echo BRANCH;?>' + MiscUtils.customerId(data.customerid)));
	 
     document.getElementById('bridename').appendChild(document.createTextNode(data.bridename == null ? '' : data.bridename));
     document.getElementById('bridephone').appendChild(document.createTextNode(data.bridephone == null ? '' : data.bridephone));
     document.getElementById('bridemobile').appendChild(document.createTextNode(data.bridemobile == null ? '' : data.bridemobile));
     document.getElementById('brideemail').appendChild(document.createTextNode(data.brideemail == null ? '' : data.brideemail));
     document.getElementById('bridead1').appendChild(document.createTextNode(data.brideaddrLn1 == null ? '' : data.brideaddrLn1));
     document.getElementById('bridead2').appendChild(document.createTextNode(data.brideaddrLn2 == null ? '' : data.brideaddrLn2));
    // document.getElementById('bridead3').appendChild(document.createTextNode(data.brideaddrLn3 == null ? '' : data.brideaddrLn3));
    // document.getElementById('bridead4').appendChild(document.createTextNode(data.brideaddrLn4 == null ? '' : data.brideaddrLn4));
     
     document.getElementById('groomname').appendChild(document.createTextNode(data.groomname == null ? '' : data.groomname));
     document.getElementById('groomphone').appendChild(document.createTextNode(data.groomphone == null ? '' : data.groomphone));
     document.getElementById('groommobile').appendChild(document.createTextNode(data.groommobile == null ? '' : data.groommobile));
     document.getElementById('groomemail').appendChild(document.createTextNode(data.groomemail == null ? '' : data.groomemail));
     document.getElementById('groomad1').appendChild(document.createTextNode(data.groomaddrLn1 == null ? '' : data.groomaddrLn1));
     document.getElementById('groomad2').appendChild(document.createTextNode(data.groomaddrLn2 == null ? '' : data.groomaddrLn2));
     //document.getElementById('groomad3').appendChild(document.createTextNode(data.groomaddrLn3 == null ? '' : data.groomaddrLn3));
     //document.getElementById('groomad4').appendChild(document.createTextNode(data.groomaddrLn4 == null ? '' : data.groomaddrLn4));

     showorder(data.orders);
	    
 }

 function showorder(data)
 {
	 var p = data[0];

	 if(p.disposalstatus == 0 ) 
     {
     	 document.getElementById('otype').appendChild(document.createTextNode(p.type == null ? '' : p.type));

     	var otype1 = (p.type).toLowerCase();


	    var span = document.createElement('span');
	    span.style.fontSize = '140%';
	    span.style.fontWeight = 'bold';
	    span.style.color = '#663333';
	    
    	if(otype1 == 'wedding')
    	{
    		span.appendChild(document.createTextNode('wedding date:'));
    	}else{
    		span.appendChild(document.createTextNode('working date:'));
    	}

    	document.getElementById('odate').appendChild(span);

	    //var div = document.createElement('div');
	    //div.style.fontSize = '100%';
	    //div.appendChild(document.createTextNode(SimpleDate.format(p.date)));

    	
    	document.getElementById('odate').appendChild(document.createTextNode(SimpleDate.format(p.date)));


    	document.getElementById('ptype').appendChild(document.createTextNode('  ' + p.photoname));
    	document.getElementById('vtype').appendChild(document.createTextNode('  ' + p.videoname));


    	/*payment*/
    	document.getElementById('price').appendChild(document.createTextNode((p.price > 0) ? '$' + (p.price * parseFloat(1 + parseFloat('<?php echo GST;?>'), 10)).toFixed(2) + ' (Inc.<?php echo TAX;?>)' : '$0.00' ));


    	 var rule =  payment(otype1);



    	 for(var i = 1, j = rule.length; i <= j;i++)
    	 {
    		 var ru = rule[i-1];
    		 tr = document.getElementById('showpayment').insertRow(-1);//行
    		 tr.height='30px';
    		 td = tr.insertCell(-1);
    		 td.className = 'contract_td5';
    		    
    		 if(i == 1) 
    		 {
    		    td.appendChild(document.createTextNode('Deposit'));
    		 }else{
    			if(i == 2)
    			{
    				var fsup = 'nd';
    			}else if(i == 3){
    				var fsup = 'rd';
    			}else if(i == 4){
    				var fsup = 'th';
    			}

                var sup = document.createElement('sup');
                sup.appendChild(document.createTextNode(fsup));
    			
    		    td.appendChild(document.createTextNode(i));
    		    td.appendChild(sup);
    		    td.appendChild(document.createTextNode('  payment'));


    		 }

             
            var gstprice = p.price * parseFloat(1 + parseFloat('<?php echo GST;?>'), 10);
 		    var syscal = parseFloat(gstprice* ru.perc).toFixed(2);
 		    td = tr.insertCell(-1);
 		    td.colSpan = 3;
 		    td.appendChild(document.createTextNode('$'+syscal + ' (Inc.<?php echo TAX;?>)'  + ru.title + ru.comment.toLowerCase()));
 		       		 
    	 }


    	 showproducts(p.products);

        /*payment*/

        /*cnote*/
        document.getElementById('cnote').appendChild(document.createTextNode(p.note));
        /*cnote*/
    	
        /*contract*/  
    	var c = p.contract[0];//contract_list_div
    	document.getElementById('contract_list_div').appendChild(MiscUtils.span(c.content));



    	/*sign*/
    	if(p.sign.length == 0)
    	{
    		$('.sigPad').signaturePad({drawOnly : true});
            $('#oprint').css("display","none");
            $('#opr').css("display","");
    		
    		var sdate = SimpleDate.format(SimpleDate.fromStamp(<?php echo $time;?>));
    		document.getElementById('sdate').appendChild(document.createTextNode('Signed on  ' + sdate));
    		     	
        }else{
            var sig = p.sign[0].signature;
            $('.sigPad').signaturePad({displayOnly : true}).regenerate(sig);
            $('#oprint').css("display","");
            $('#opr').css("display","none");

    		var sdate = SimpleDate.format(p.sign[0].createdDate);
    		document.getElementById('sdate').appendChild(document.createTextNode('Signed on  ' + sdate));            
        }
    	/*sign*/
     }
 }


function showproducts(data)
{
	 var sum =0,sum1=0;
	for(var ii = 0,jj = data.length ; ii < jj; ii++)
	{
		var mm = data[ii];
		
        if(mm.cancelled == 1) continue;

        if(mm.packageInc != '')
        {
            sum =parseInt(sum) + 1;
        	 
        }else{
        	sum1 =parseInt(sum1) + 1;
        }
	}

	
	if(sum == 0 || sum1 == 0)
	{
        if(sum == 0)
        {
        	tr = document.getElementById('pproducts').insertRow(-1);//行
        }

        if(sum1 == 0){
        	tr = document.getElementById('aproducts').insertRow(-1);//行
        }

        td = tr.insertCell(-1);
        td.colSpan = 3;
        td.width='665px';
        td.textAlign='center'
        td.className = 'tltd td1';
        td.appendChild(document.createTextNode('N/A'));		
    }

   
	for(var i = 0,j = data.length ; i < j; i++)
	{
		var m = data[i];
		
        if(m.cancelled == 1) continue;

        if(m.packageInc != '')
        {
        	tr = document.getElementById('pproducts').insertRow(-1);//行
        	 
        }else{
        	tr = document.getElementById('aproducts').insertRow(-1);//行
        	 //td = tr.insertCell(-1);
            
        }

        td = tr.insertCell(-1);
        td.width = '406px';
        td.className = 'tltd td1';
        td.appendChild(document.createTextNode(m.name));

        td = tr.insertCell(-1);
        td.width = '121px';
        td.className = 'tltd td23';
        td.appendChild(document.createTextNode(m.quantity));

        td = tr.insertCell(-1);
        td.width = '138px';
        td.className = 'tltd td23';
        td.appendChild(document.createTextNode(m.unit));        
   }
}
 

 function payment(type)
 {
	 if(type == 'wedding')
	 {
		 return [ { rate: '<?php echo WEDDING_PAYMENT_RATE1;?>', perc: '<?php echo WEDDING_PAYMENT_PERC1;?>', title: '<?php echo WEDDING_PAYMENT_TITLE1;?>', comment: '<?php echo WEDDING_PAYMENT_COMMENT1;?>'},
		          { rate: '<?php echo WEDDING_PAYMENT_RATE2;?>', perc: '<?php echo WEDDING_PAYMENT_PERC2;?>', title: '<?php echo WEDDING_PAYMENT_TITLE2;?>', comment: '<?php echo WEDDING_PAYMENT_COMMENT2;?>'},
		          { rate: '<?php echo WEDDING_PAYMENT_RATE3;?>', perc: '<?php echo WEDDING_PAYMENT_PERC3;?>', title: '<?php echo WEDDING_PAYMENT_TITLE3;?>', comment: '<?php echo WEDDING_PAYMENT_COMMENT3;?>'},
		          { rate: '<?php echo WEDDING_PAYMENT_RATE4;?>', perc: '<?php echo WEDDING_PAYMENT_PERC4;?>', title: '<?php echo WEDDING_PAYMENT_TITLE4;?>', comment: '<?php echo WEDDING_PAYMENT_COMMENT4;?>'}
		        ];
	 }else if(type == 'prewedding'){
			 return [ { rate: '<?php echo PREWEDDING_PAYMENT_RATE1;?>', perc: '<?php echo PREWEDDING_PAYMENT_PERC1;?>', title: '<?php echo PREWEDDING_PAYMENT_TITLE1;?>', comment: '<?php echo PREWEDDING_PAYMENT_COMMENT1;?>'},
			          { rate: '<?php echo PREWEDDING_PAYMENT_RATE2;?>', perc: '<?php echo PREWEDDING_PAYMENT_PERC2;?>', title: '<?php echo PREWEDDING_PAYMENT_TITLE2;?>', comment: '<?php echo PREWEDDING_PAYMENT_COMMENT2;?>'}
			        ];
	 }else if(type == 'engagement'){
			 return [ { rate: '<?php echo ENGAGEMENT_PAYMENT_RATE1;?>', perc: '<?php echo ENGAGEMENT_PAYMENT_PERC1;?>', title: '<?php echo ENGAGEMENT_PAYMENT_TITLE1;?>', comment: '<?php echo ENGAGEMENT_PAYMENT_COMMENT1;?>'},
			          { rate: '<?php echo ENGAGEMENT_PAYMENT_RATE2;?>', perc: '<?php echo ENGAGEMENT_PAYMENT_PERC2;?>', title: '<?php echo ENGAGEMENT_PAYMENT_TITLE2;?>', comment: '<?php echo ENGAGEMENT_PAYMENT_COMMENT2;?>'}
			        ];
	 }else if(type == 'portrait'){
			 return [ { rate: '<?php echo PORTRAIT_PAYMENT_RATE1;?>', perc: '<?php echo PORTRAIT_PAYMENT_PERC1;?>', title: '<?php echo PORTRAIT_PAYMENT_TITLE1;?>', comment: '<?php echo PORTRAIT_PAYMENT_COMMENT1;?>'},
			          { rate: '<?php echo PORTRAIT_PAYMENT_RATE2;?>', perc: '<?php echo PORTRAIT_PAYMENT_PERC2;?>', title: '<?php echo PORTRAIT_PAYMENT_TITLE2;?>', comment: '<?php echo PORTRAIT_PAYMENT_COMMENT2;?>'}
			        ];
	}else if(type == 'other'){
			 return [ { rate: '<?php echo OTHER_PAYMENT_RATE1;?>', perc: '<?php echo OTHER_PAYMENT_PERC1;?>', title: '<?php echo OTHER_PAYMENT_TITLE1;?>', comment: '<?php echo OTHER_PAYMENT_COMMENT1;?>'}
			        ];
	}

 }

 function SimpleDate() {
 };

 SimpleDate.create = function(year, month, date, hours, minutes, seconds) {
	  if (!arguments.length) {
	    return this.fromDate(new Date(), false);
	  }
	  return { year: (year != null) ? year : 0,
	           month: (month != null) ? month : 0,
	           date: (date != null) ? date : 0,
	           hours: (hours != null) ? hours : 0,
	           minutes: (minutes != null) ? minutes : 0,
	           seconds: (seconds != null) ? seconds : 0
	         };
	};

	SimpleDate.fromDate = function(d, hasTime) {
	  if (!d) {
	    return this.create(0, 0, 0);
	  }
	  if (hasTime) {
	    return this.create(d.getFullYear(), d.getMonth() + 1, d.getDate(), d.getHours(), d.getMinutes(), d.getSeconds());
	  } else {
	    return this.create(d.getFullYear(), d.getMonth() + 1, d.getDate());
	  }
	};

	SimpleDate.fromStamp = function(stamp, hasTime) {
	  return this.fromDate(new Date(stamp * 1000), hasTime);
	};

	SimpleDate.toDate = function(sd) {
	  if (!sd) {
	    return null;
	  }
	  return new Date(sd.year, sd.month - 1, sd.date, sd.hours, sd.minutes, sd.seconds);
	};

	SimpleDate.toStamp = function(sd) {
	  if (!sd) {
	    return null;
	  }
	  var d = this.toDate(sd);
	  return (d) ? (d.getTime() / 1000) : 0;
	};

	SimpleDate.clone = function(sd) {
	  if (!sd) {
	    return null;
	  }
	  return SimpleDate.create(sd.year, sd.month, sd.date, sd.hours, sd.minutes, sd.seconds);
	};

	SimpleDate.fmtDigits = function(num) {
	  num = parseInt(num, 10);
	  return (num < 10) ? ('0' + num) : num;
	};

	SimpleDate.forward = function(sd, stamp) {
	  return this.fromStamp(this.toStamp(sd) + stamp, true);
	};

	SimpleDate.backward = function(sd, stamp) {
	  return this.fromStamp(this.toStamp(sd) - stamp, true);
	}; 
 
 /*SimpleDate.fmtDigits = function(num) {
	  num = parseInt(num, 10);
	  return (num < 10) ? ('0' + num) : num;
	};*/
	
	SimpleDate.format = function(sd, showTime) {
		  if (!sd) {
		    return 'Unknown';
		  }
		  if (!showTime) {
		    return SimpleDate.fmtDigits(sd.date) + '/' + SimpleDate.fmtDigits(sd.month) + '/' + sd.year;
		  }
		  return SimpleDate.fmtDigits(sd.hours) + ':' + SimpleDate.fmtDigits(sd.minutes) + ',' + SimpleDate.fmtDigits(sd.date) + '/' + SimpleDate.fmtDigits(sd.month) + '/' + sd.year;
		};

		function MiscUtils() {
		};

		MiscUtils.span = function(content) {
			  span = document.createElement('span');
			  var str = '';
			  for (var i = 0, il = content.length; i < il; i++) {
			    if (content.charAt(i) != '\n') {
			      str += content.charAt(i);
			    } else {
			      span.appendChild(document.createTextNode(str));
			      span.appendChild(document.createElement('br'));
			      str = '';
			    }
			  }
			  span.appendChild(document.createTextNode(str));
			  return span
			};
			MiscUtils.customerId = function(customerId) {
				  if (customerId < 100000 && customerId >= 10000) {
				    customerId = customerId;
				  } else if (customerId < 10000 && customerId >= 1000) {
				    customerId = '0' + customerId;
				  } else if (customerId < 1000 && customerId >= 100) {
				    customerId = '00' + customerId;
				  } if (customerId < 100 && customerId >= 10) {
				    customerId = '000' + customerId;
				  } if (customerId < 10 && customerId > 0) {
				    customerId = '0000' + customerId;
				  }
				  return customerId;
				};

	function savesign()
	{
		  var output = $("#output").val();
		  $.ajax({
				type:'POST',
				url:'server.php',
				data:"orderid=<?php echo $_REQUEST['orderid']; ?>&output="+output+"&action=save",
				dataType: "json",
				success:function(data){
					 //showdata(data.data[0]);
					 var sg = data.data[0];
					 //console.log(sg);
                       if(sg.signature != '')
                       {
                           window.location.href="contract.php?orderid="+sg.orderid;
                    	   //$('.sigPad').signaturePad({}); 
                           //var sig = sg.signature;
                           //$('.sigPad').signaturePad({displayOnly : true}).regenerate(sig);
                           
                           
                           //$('#oprint').css("display","");
                           //$('#opr').css("display","none");                          
                       }
                           
                       
					}		
				}); 		
	}

  function webprint()
  {
	  window.print();
  }	
												 
</script>
 </head>
 <body >
<div id="container">
  <table class="contract_table1" cellPadding="0" cellSpacing="0">
    <tr>
      <td class="contract_td1">
        Customer No.
      </td>
      <td class="contract_td2" id="customerno"></td>
    </tr>
  </table>
  
  <table class="contract_table2" cellPadding="0" cellSpacing="0">
    <tr>
      <td>
        <img src="../images/common/line.png"></img>
      </td>
    </tr>
  </table>
  
  <table class="contract_table3" cellPadding="0" cellSpacing="0">
    <tr>
      <td class="contract_td3">
        Bride Name
      </td>
      <td class="contract_td4" id="bridename"></td>
      <td class="contract_td5">
        Groom Name
      </td>
      <td class="contract_td6" id="groomname"></td>
    </tr>
    
    <tr>
      <td class="contract_td3">
       Address
      </td>
      <td class="contract_td4" id="bridead1"></td>
      <td class="contract_td5">
       Address
      </td>
      <td class="contract_td6" id="groomad1"></td>
    </tr>
    
    <tr>
      <td class="contract_td3">&nbsp;</td>
      <td class="contract_td4" id="bridead2"></td>
      <td class="contract_td5">&nbsp;</td>
      <td class="contract_td6" id="groomad2"></td>
    </tr>

    <!--  <tr>
      <td class="contract_td3">State</td>
      <td class="contract_td4" id="bridead3"></td>
      <td class="contract_td5">State</td>
      <td class="contract_td6" id="groomad3"></td>
    </tr>
    
    <tr>
      <td class="contract_td3">Post Code</td>
      <td class="contract_td4" id="bridead4"></td>
      <td class="contract_td5">Post Code</td>
      <td class="contract_td6" id="groomad4"></td>
    </tr> -->   
    <tr>
      <td class="contract_td3">
        Phone
      </td>
      <td class="contract_td4" id="bridephone"></td>
      <td class="contract_td5">
        Phone
      </td>
      <td class="contract_td6" id="groomphone"></td>
    </tr>
    
    <tr>
      <td class="contract_td3">
        Mobile
      </td>
      <td class="contract_td4" id="bridemobile"></td>
      <td class="contract_td5">
        Mobile
      </td>
      <td class="contract_td6" id="groommobile"></td>
    </tr>
    <tr>
      <td class="contract_td3">
        Email
      </td>
      <td class="contract_td4" id="brideemail"></td>
      <td class="contract_td5">
        Email
      </td>
      <td class="contract_td6" id="groomemail"></td>
    </tr>
  </table>
  
  <table class="contract_table2" cellPadding="0" cellSpacing="0">
    <tr>
      <td>
        <img src="../images/common/line.png"></img>
      </td>
    </tr>
  </table>
  
  <table class="contract_table9" cellPadding="0" cellSpacing="0">
    <tr>
      <td id="contract_orderInfo_div" align="center">
      <table width="100%" class="pl15" border=0>
         <tr>
            <td id='otype' class="contract_td3  f140"></td>
            <td  colspan='3'><div id='odate' ></div></td>
         </tr>

         <tr style="height:30px;">
            <td class="contract_td3 f120" nowrap width="25%">Photo Package</td>
            <td  width="30%" class="contract_td4"><div id='ptype'></div></td>
            <td class="contract_td5 f120" nowrap width="20%">Video Package</td>
            <td   width="25%" class="contract_td6"><div id='vtype'></div></td>
         </tr>
        <!-- package includes -->
         <tr>
            <td class="contract_td5 f130" colspan='4'>Package Includes</td>
         </tr>
         <tr>
            <td colspan='4'>
               <table   class="tltable" cellSpacing = '0' cellpadding = '0'>
                  <tr>
                      <td class='contract_td5 tltd td1  f120'>Name</td>
                      <td class='contract_td5 tltd td23 f120'>Qty</td>
                      <td class='contract_td5 tltd td23 f120'>Unit</td>
                  </tr>
                     <tbody id='pproducts'>
                     </tbody>                  
               </table>
            </td>
         </tr>
        <!-- package includes -->
        
        
        
         <!-- Additions -->
         <tr>
            <td class="contract_td5  f130" colspan='4'>Additions</td>
         </tr>
         <tr>
            <td colspan='4'>
               <table class="tltable"  cellSpacing = '0' cellpadding = '0'>
                  <tr>
                      <td class='contract_td5 tltd td1 f120'>Name</td>
                      <td class='contract_td5 tltd td23 f120'>Qty</td>
                      <td class='contract_td5 tltd td23 f120'>Unit</td>
                  </tr>
                     <tbody id='aproducts'>
                     </tbody>                        
               </table>
            </td>
         </tr>
        <!-- Additions -->       
        
        
          <!-- payment -->
         <tr>
            <td class="contract_td5  f130" colspan='4'>Payment</td>
         </tr>
         <tr style="heigth:30px;">
            <td class="contract_td5">Price</td>
            <td class="bder" colspan='3' id="price"></td>
         </tr>
         <tbody id='showpayment'>
         </tbody>
        <!-- payment -->           
        
         <!-- note --> 
          <tr>
            <td class="contract_td5  f130">Note</td>
            <td  colspan='3' id="cnote"></td>
         </tr>        
         <!-- note --> 
      </table>
        
      </td>
    </tr>
  </table>
  
  <table class="contract_table2" cellPadding="0" cellSpacing="0">
    <tr>
      <td>
        <img src="../images/common/line.png"></img>
      </td>
    </tr>
  </table>
  
  
  <table class="contract_table8" cellPadding="0" cellSpacing="0">
    <tr>
      <td class="contract_td24" id="contract_list_div"></td>
    </tr>
  </table>
  
  <table class="contract_table2" cellPadding="0" cellSpacing="0">
    <tr>
      <td class="contract_td255" align="center">
      <form method="post" action="" class="sigPad">
		  <div class="sig sigWrapper"  align="center">
		    <div class="typed"></div>
		    <canvas class="pad" width="698" height="255" align="center"></canvas>
		    <input type="hidden" name="output" id="output" class="output">
		  </div>
		  <br>
		  <br>
		  <div><span id="sdate"></span></div>
		  <br>
		  <br>
		  <div id="opr"  style="display:none;">
		  <span class="clearButton"><a href="#clear"><img src="images/home/clear.png"></a></span>&nbsp;<img id="save" onclick="savesign();" src="images/home/save.png"></div>
		  <div id="oprint" style="display:none;">
		  <img id="save" src="images/home/print.png" onclick="webprint();"></div>
		</form>
      </td>
    </tr>
  </table>
</div>
 </body>
</html>